<template>
  <el-dialog :title="dataForm.operationType == 3 ? '储值卡充值' : '储值卡提现'" :close-on-click-modal="false" :visible.sync="visible"
    center>
    <el-button class="miui-dialog-close-btn" @click="visible = false">关闭页面</el-button>
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" class="verify-form" label-width="80px">
      <el-form-item label="操作类型" prop="operationType">
        <el-radio-group v-model="dataForm.operationType" @change="changeType">
          <el-radio :label="3">充值</el-radio>
          <el-radio :label="4">提现</el-radio>
        </el-radio-group>

      </el-form-item>
      <el-form-item label="储值卡号" prop="cardNum">
        <el-input v-model="dataForm.cardNum" placeholder="储值卡号" disabled></el-input>
      </el-form-item>
      <el-form-item label="卡内金额" prop="balance">
        <el-input v-model="dataForm.balance" placeholder="卡内金额" disabled></el-input>
      </el-form-item>
      <el-form-item label="实付金额" prop="realPayMoney" v-if="dataForm.operationType == 3">
        <el-input v-model="dataForm.realPayMoney" placeholder="实付金额" @change="sumChange(dataForm.realPayMoney,dataForm.givenMoney)"></el-input>
      </el-form-item>
      <el-form-item label="赠送金额" prop="givenMoney" v-if="dataForm.operationType == 3">
        <el-input v-model="dataForm.givenMoney" placeholder="赠送金额" @change="sumChange(dataForm.realPayMoney,dataForm.givenMoney)"></el-input>
      </el-form-item>
      <el-form-item label="储值金额" prop="changeMoney" v-if="dataForm.operationType == 3">
        <el-input v-model="dataForm.changeMoney" placeholder="储值金额" disabled></el-input>
      </el-form-item>
      <el-form-item label="提现金额" prop="changeMoney" v-if="dataForm.operationType == 4">
        <el-input v-model="dataForm.changeMoney" placeholder="储值金额"></el-input>
      </el-form-item>
      <el-form-item label="备注" prop="memo">
        <el-input v-model="dataForm.memo" placeholder="备注"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit" :loading="ischeck" v-prevent-re-click>确定</el-button>
    </span>
    <search-customer v-if="searchCustomerVisible" ref="searchCustomer" @refreshForm="updateForm"></search-customer>
  </el-dialog>
</template>

<script>
  import {
    getObj,
    saveCardTopUpOrWithdrawMoney
  } from "@/api/eims/savemoneycard"
  import {
    getDeptInfo
  } from "@/api/admin/dept"

  import SearchCustomer from '@/components/business/customer-search'

  export default {
    data() {
      var moneyCheck = (rule, value, callback) => {
        let numPattern = /^-?\d*\.?\d+$/
        if (!numPattern.test(value)) {
          callback(new Error("请输入阿拉伯数字"))
        } else {
          callback()
        }
      };
      return {
        ischeck: false,
        visible: false,
        type: "",
        deptIdOptions: [],
        searchCustomerVisible: false,
        dataForm: {
          id: 0,
          operationType: 3,
          cardNum: "",
          cardNumBefore: "",
          cardNumAfter: "",
          saleDeptId: "",
          createDeptId: "",
          realPayMoney: "0.00",
          givenMoney: "0.00",
          changeMoney: "0.00",
          balance: "",
          customerId: "",
          customerName: '',
          idNumber: "",
          isPassword: "",
          password: "",
          number: "",
          memo: "",
        },
        dataRule: {
          realPayMoney: [{
              required: true,
              message: "实付金额不能为空",
              trigger: "blur"
            },
            {
              validator: moneyCheck
            }
          ],
          givenMoney: [{
              required: true,
              message: "赠送金额不能为空",
              trigger: "blur"
            },
            {
              validator: moneyCheck
            }
          ],
          changeMoney: [{
            required: true,
            message: "储值金额不能为空",
            trigger: "blur"
          }],
        }
      };
    },
    components: {
      SearchCustomer
    },
    methods: {
      init(id) {
        this.dataForm.id = id || 0;
        this.visible = true;
        this.$nextTick(() => {
          this.getDataList();
          this.$refs["dataForm"].resetFields();
          if (this.dataForm.id) {
            getObj(this.dataForm.id).then(response => {
              if(response.data.code == '0'){
                this.dataForm = response.data.data
                this.dataForm.operationType = 3
                this.dataForm.realPayMoney = 0.00
                this.dataForm.givenMoney = 0.00
                this.dataForm.changeMoney = 0.00
              }else{
                this.$message.error(response.data.msg)
              }
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit() {
        this.ischeck = true
        this.$refs["dataForm"].validate(valid => {
          if (valid) {
            if (this.dataForm.id) {
              saveCardTopUpOrWithdrawMoney(this.dataForm).then(response => {
                if(response.data.code == '0'){
                  this.$message.success("修改成功")
                  this.visible = false
                  this.$emit("refreshDataList")
                }else{
                  this.$message.error(response.data.msg)
                }
                this.ischeck = false
              }).catch(() => {
                this.ischeck = false
              })
            }
          }else{
            this.ischeck = false
          }
        });
      },
      getDataList() {
        getDeptInfo().then(response => {
          if(response.data.code == '0'){
            let result = response.data.data
            let list = []
            result.forEach(item => {
              list.push({
                value: item.id,
                label: item.name
              })
            })
            this.deptIdOptions = list
          }else{
            this.$message.error(response.data.msg)
          }
        })
      },
      sumChange(val1, val2) {
        let a = val1 == "" ? 0 : parseFloat(val1)
        let b = val2 == "" ? 0 : parseFloat(val2)
        this.dataForm.changeMoney = a + b
      },
      selectCustomer() {
        this.searchCustomerVisible = true
        this.$nextTick(() => {
          this.$refs.searchCustomer.init('')
        })
      },
      updateForm(data) {
        this.dataForm.customerId = data.id
        this.dataForm.customerName = data.name
      },
      changeType() {
        for (let key in this.dataForm) {
          if (key == 'realPayMoney' || key == 'givenMoney' || key == 'changeMoney') {
            this.dataForm[key] = 0.00
          }
          if (key == 'memo') {
            this.dataForm[key] = ''
          }
        }
      }
    }
  };
</script>
